<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://www.gzsxt.cn/fucntions" prefix="myFn"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>

<base href="<%=basePath%>">

<link rel="stylesheet" type="text/css"
	href="resources/easyui/themes/default/easyui.css">
<link rel="stylesheet" type="text/css"
	href="resources/easyui/themes/icon.css">
<link rel="stylesheet" type="text/css"
	href="resources/easyui/demo/demo.css">


<script type="text/javascript" src="resources/easyui/jquery.min.js"></script>
<script type="text/javascript"
	src="resources/easyui/jquery.easyui.min.js"></script>
<script type="text/javascript"
	src="resources/easyui/locale/easyui-lang-zh_CN.js"></script>

<script type="text/javascript">
	$(function() {
		$("#myDataGrid").datagrid({
			fit : true,
			title : '用户管理',
			fitColumns : true,
			url : 'user/userList.do',
			method : 'get',
			pagination : true,
			toolbar : "#toolbar",
			striped : true,
			//singleSelect : true,
		}); 

		$("#myDialog").dialog({
			width : 500,
			height : 480,
			buttons : "#dialogButtons",
			closed : true,
		});

		$("#roleComBobox").combobox({
			url:"role/getAllRoles.do",
			valueField:'id',    
		    textField:'text'
		});
	
		
	});
	
	function formatterUserGender(value, row, index) {
		if (value == 0) {
			return "女";
		} else {
			return "男";
		}
	}

	function formatterCreateDate(value, row, index) {
		var date = new Date(value);
		var y = date.getFullYear();
		var m = date.getMonth() + 1;
		var d = date.getDate();
		return y + '-' + m + '-' + d;
	}

	var cmdObj = {
		openDialog : function() {
			$("#myDialog").dialog("open");
			$("#myDialog").dialog("setTitle", "添加用户");
			$("#userForm").form("clear");
			$("#user_pass").val("123456");
			$("#user_gender").val("1")
			$("input[name='user_gender']").get(0).checked=true; 
		},
		saveOrUpdateUser : function() {

			var user_id = $("#user_id").val();

			var url = "";
			if (user_id != "") {
				url = "user/updateUser.do"
			} else {
				url = "user/addUser.do";
			}

			$('#userForm').form('submit', {
				url : url,
				success : function(data) {
					data = eval("(" + data + ")");
					if (data.code == 1) {
						$.messager.alert("温馨提示", data.msg, 'info');
						$("#admin_id").val("");
						$("#myDialog").dialog("close");
						$("#myDataGrid").datagrid("reload");

					} else {
						$.messager.alert("温馨提示", data.msg, 'error');
					}

				}
			});
		},
		del : function() {
			var rowData = $("#myDataGrid").datagrid("getSelections");
			if (rowData == null) {
				$.messager.alert("温馨提示", "请选择需要删除的行", 'warning');
				return;
			}
			$.messager.confirm('确认', '您确认想要删除记录吗？', function(r) {
				if (r) {
					var user_id = new Array(rowData.length);
					for (var i = 0; i < rowData.length; i++) {
						user_id[i] = rowData[i].user_id;
					}
					console.log(user_id);
					$.get("user/deleteUserById.do", {
						"user_ids" : user_id
					}, function(data) {
						if (data.code == 1) {
							$.messager.alert("温馨提示", data.msg, 'info');
							$("#myDataGrid").datagrid("reload");

						} else {
							$.messager.alert("温馨提示", data.msg, 'error');
						}
					});
				}
			});
		},
		editUser : function() {
			var rowData = $("#myDataGrid").datagrid("getSelections");
			if (rowData.length == 0) {
				$.messager.alert("温馨提示", "请选择需要修改的用户", 'warning');
				return;
			}else if(rowData.length > 1){
				$.messager.alert("温馨提示", "对8起,暂时不支持多行修改", 'warning');
				return;
			}
			$("#userForm").form("load", rowData[0]);
			$("#myDialog").dialog("open");
			$("#myDialog").dialog("setTitle", "修改用户");

		},
		closeDialog : function() {
			$("#myDialog").dialog("close");
		},
		search:function(){
			$("#myDataGrid").datagrid("load",{
				sname:$("#sname").val(),
				sgender:$('input[name="sgender"]:checked').val(),
				sdate:$("#sdate").datebox("getValue")
			});
		}
		/* upload:function(){
			var user_icon = $("#user_icon").val()
			if (user_icon == "") {
				$.messager.alert("温馨提示", "请先选择上传的图片", 'warning');
				return;
			}
			$.post("user/upload.do", {
				"user_icon" : user_icon
			}, function(data) {
				console.log(data);
			}); 
		} */
	}
</script>

<div id="myDialog" class="easyui-dialog">
	<form id="userForm" action="" method="post">
		<input type="hidden" id="user_id" name="user_id">
		<table style="margin-top: 10;" align="center">
			<tr>
				<td style="text-align: right;">用户名称:
				<td>
				<td><input style="width: 300px; height: 30px;" name="user_name"
					class="easyui-validatebox" data-options="{required:true}"></td>
			</tr>
			<tr>
				<td style="text-align: right;">用户密码:
				<td>
				<td><input style="width: 300px; height: 30px;" id="user_pass" name="user_pass"
					type="password" value="123456"></td>
			</tr>
			<tr>
				<td style="text-align: right;">用户性别(必填):
				<td>
				<td>男<input type="radio" name="user_gender" value="1" id="user_gender"
					checked="checked"> 女<input type="radio" name="user_gender"
					value="0">
				</td>
			</tr>
			<tr>
				<td style="text-align: right;">个人签名:
				<td>
				<td><textarea name="user_signature"
						style="width: 300px; height: 100px;" id="user_signature"
						class="text_sketch"></textarea></td>
			</tr>
			<tr>
				<td style="text-align: right;">用户邮箱:
				<td>
				<td><input style="width: 300px; height: 30px;"
					name="user_email"></td>
			</tr>
			<tr>
				<td style="text-align: right;">用户手机:
				<td>
				<td><input style="width: 300px; height: 30px;" name="user_tel"></td>
			</tr>
			<tr>
				<td style="text-align: right;">用户类型:<td>
				<td>
					<input id="roleComBobox" name="role_id"  class="easyui-combobox" data-options="{required:true}">
				</td>
			</tr>
			<tr>
				<td style="text-align: right;">用户头像:
				<td>
				<td>
					<form action="user/upload.do" enctype="multipart/form-data" method="post">
						
						<!-- <input class="easyui-filebox" name="file1" data-options="prompt:'Choose a file...'" style="width:200px;"> -->
						<input class="easyui-filebox" id="user_icon" name="user_icon" style="width:200px;">
						<!-- <a onclick="cmdObj.upload();" class="easyui-linkbutton" style="width:50px;">上传</a> -->
						<!-- <input type="submit" value="上传"/> -->
					</form>
				</td>
			</tr>
			

			<tr>
				<td style="text-align: right;">注册日期:
				<td>
				<td><input style="width: 300px; height: 30px;" id="user_date"
					name="user_date" type="text" class="easyui-datebox" data-options="{required:true}"></td>
			</tr>
			<tr>
				<td style="text-align: right;">用户状态:
				<td>
				<td><select class="easyui-combobox" style="width: 100px;" data-options="{required:true}"
					name="user_Status">
						<option value="0">可用</option>
						<option value="1">不可用</option>
				</select></td>
			</tr>
			
		</table>

	</form>

</div>


<div id="dialogButtons">
	<a onclick="cmdObj.saveOrUpdateUser();" class="easyui-linkbutton"
		data-options="{iconCls:'icon-save',plain:true}">保存</a> <a
		onclick="cmdObj.closeDialog();" class="easyui-linkbutton"
		data-options="{iconCls:'icon-cancel',plain:true}">取消</a>
</div>

<div id="toolbar">
	<div>
		<label>请输入用户名:</label>
		<input style="width: 150px; height: 25px;" name="sname" id="sname">&nbsp;&nbsp;&nbsp;&nbsp;
		<label>请选择用户性别:</label>
		男<input type="radio" name="sgender" id="sgender" value="1"> 
		女<input type="radio" name="sgender" id="sgender"value="0">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
		<label>请选择注册日期:</label>
		<input style="width: 100px; height: 30px;" id="sdate"
					name="sdate" type="text" class="easyui-datebox">&nbsp;&nbsp;&nbsp;
		<a onclick="cmdObj.search();" class="easyui-linkbutton"
			data-options="{iconCls:'icon-search'}">搜索</a>
	</div>
	<br>
	<hr>
	<div>
		<c:if test="${myFn:checkPermission('user/addUser.do')}">
		<a onclick="cmdObj.openDialog();" class="easyui-linkbutton"
			data-options="iconCls:'icon-add',plain:true">添加用户</a>
	</c:if>
	<c:if test="${myFn:checkPermission('user/updateUser.do')}">
		<a onclick="cmdObj.editUser();" class="easyui-linkbutton"
			data-options="{iconCls:'icon-edit',plain:true}">修改</a>
	</c:if>
	<c:if test="${myFn:checkPermission('user/deleteUserById.do')}">
		<a onclick="cmdObj.del();" class="easyui-linkbutton"
			data-options="{iconCls:'icon-remove',plain:true}">删除</a>
	</c:if>
	</div>
</div>

<table id="myDataGrid" class="easyui-datagrid">
	<thead>
		<tr>
			<th data-options="field:'user_id',width:1">序号</th>
			<th data-options="field:'user_name',width:1">用户名称</th>
			<th data-options="field:'user_pass',width:1">用户密码</th>
			<th
				data-options="field:'user_gender',width:1,align:'center',formatter:formatterUserGender">用户性别</th>
			<th data-options="field:'user_email',width:1">用户邮箱</th>
			<th data-options="field:'user_tel',width:1">用户手机</th>
			<th
				data-options="field:'user_date',width:1,align:'center',formatter:formatterCreateDate">注册日期</th>
		</tr>
	</thead>
</table>